import Taro, { Component } from '@tarojs/taro'
import { View, Input, Textarea, Button } from '@tarojs/components'
import './add-quertion.scss'
import Dialog from '../dialog/dialog'

export default class AddQuestion extends Component {
  state = {
    title: '',
    des: ''
  }
  cancel() {
    const { cancelQuestion } = this.props
    cancelQuestion && cancelQuestion()
  }
  inputTitle(e) {
    this.setState({ title: e.target.value })
  }
  inputDes(e) {
    this.setState({ des: e.target.value })
  }
  sendQuestion() {
    const { title, des } = this.state
    if (title && des) {
      const { receiveQuestion } = this.props
      receiveQuestion && receiveQuestion({ title, des })
    } else {
      Taro.showToast({
        title: '请输入问题和描述...',
        icon: 'none'
      })
    }
  }
  render() {
    return (
      <Dialog>
        <View className="question-pop">
          <Input className='input' onInput={this.inputTitle.bind(this)} placeholder='请输入你的问题...' />
          <Textarea className='textarea' onInput={this.inputDes.bind(this)} placeholder='请输入问题描述...' />
          <View className='btn-group'>
            <Button className='btn ok' onClick={this.sendQuestion.bind(this)}>确定</Button>
            <Button className='btn cancel' onClick={this.cancel.bind(this)}>取消</Button>
          </View>
        </View>
      </Dialog>
    )
  }
}